
<!--div class="row">
    <div class="span12">
        <div class="row">
            <div class="span6">
                <h1>Fydal</h1>
            </div>
            <div class="span6" style="text-align: right;">
                <p>Manage your app's user feedback from Apple's App Store, Google Play, Twitter, etc...</p>
            </div>
        </div>
    </div>
</div-->

<div class="row">
    <div class="span12">
        
        <?php if (isset($errorField) && $errorField == "other"): ?>
            <div class="alert alert-error"><?php echo $errorDescription ?></div>
        <?php endif; ?>
        
        <form class="form-horizontal well" id="signup" method="post" action="<?php echo url_for('home/doRegister') ?>">
            <fieldset>
                <legend>Sign up for Fydal - it's free!</legend>
                
                <p>We won't use your email address for any advertising, but can send you customer feedback updates if you wish.</p>
                
                <div class="control-group" id="email-group">
                    <label class="control-label" for="email">Email</label>
                    <div class="controls">
                        <input type="text" class="input-xlarge" id="email" name="email" placeholder="Email address..." value="<?php if (isset($email)) echo $email ?>" />
                    </div>
                </div>
                
                <div class="control-group" id="password-group">
                    <label class="control-label" for="password">Password</label>
                    <div class="controls">
                        <input type="password" class="input-xlarge" id="password" name="password" placeholder="Password...">
                        <p class="help-block">Passwords must be at least 8 characters long.</p>
                    </div>
                </div>
                
                <div class="control-group" id="confirm-password-group">
                    <label class="control-label" for="confirm-password">Confirm password</label>
                    <div class="controls">
                        <input type="password" class="input-xlarge" id="confirm-password" name="confirm-password" placeholder="Confirm password...">
                    </div>
                </div>
                
                <div class="form-actions">
                    <button type="submit" class="btn btn-primary">Sign up</button>
                </div>
            </fieldset>
        </form>
        
    </div>
</div>

<script type="text/javascript">
    
    $("#signup").submit(function() {
        var isValid = false;
        
        $.formValidation.clearErrorFromField("email");
        $.formValidation.clearErrorFromField("password");
        $.formValidation.clearErrorFromField("confirm-password");
        
        if ($("#email").val() && $("#email").val().indexOf("@") >= 0) {
            if ($("#password").val()) {
                if ($("#password").val().length >= 8) {
                    if ($("#password").val() == $("#confirm-password").val()) {
                        isValid = true;
                    }
                    else {
                        $.formValidation.addErrorForField("confirm-password", "Please ensure passwords match");
                    }
                }
                else {
                    $.formValidation.addErrorForField("password", "Please ensure passwords are at least 8 characters long");
                }
            }
            else {
                $.formValidation.addErrorForField("password", "Please enter a valid password");
            }
        }
        else {
            $.formValidation.addErrorForField("email", "Please enter a valid email address");
        }
        
        return isValid;
    });
    
    <?php
        if (isset($errorField) && $errorField != "other") {
            echo "$.formValidation.addErrorForField(\"" . $errorField . "\", \"" . $errorDescription . "\");";
        }
    ?>
    
</script>